<template>
  <div class="contentShadow">
    <el-container>
      <el-header style="margin-bottom: 30px">
        <h1>软件著作权成果提交表</h1>
        <el-tag>学号：{{ studentId }}</el-tag>
      </el-header>
      <el-main>
        <div>
          <el-form ref="form" :model="softwareCopyright" :rules="rules" style="text-align:left" :inline="false">
            <el-form-item label="编号" prop="softwareCopyrightId">
              <el-input v-model="softwareCopyright.softwareCopyrightId" type="text" disabled="disabled"></el-input>
            </el-form-item>
            <el-form-item label="全称" prop="fullName">
              <el-input v-model="softwareCopyright.fullName" type="text"></el-input>
            </el-form-item>
            <el-form-item label="简称" prop="shortForm">
              <el-input v-model="softwareCopyright.shortForm" type="text"></el-input>
            </el-form-item>
            <el-form-item label="版本号" prop="version">
              <el-input v-model="softwareCopyright.version" type="text"></el-input>
            </el-form-item>
            <el-form-item label="著作权人" prop="owner">
              <el-input v-model="softwareCopyright.owner" type="text"></el-input>
            </el-form-item>
            <el-form-item label="著作权证书编号" prop="code">
              <el-input v-model="softwareCopyright.code" type="text"></el-input>
            </el-form-item>
            <el-form-item label="著作权状态" prop="status">
              <el-input v-model="softwareCopyright.status" type="text"></el-input>
            </el-form-item>
            <el-form-item label="描述" prop="description">
              <el-input v-model="softwareCopyright.description" type=textarea
                        :autosize="{ minRows: 5, maxRows: 8}"></el-input>
            </el-form-item>
            <el-form-item label="开发完成日期" prop="date">
              <el-date-picker v-model="softwareCopyright.date" value-format="yyyy-MM-dd"
                              type="date"></el-date-picker>
            </el-form-item>
            <el-form-item label="开发方式" prop="method">
              <el-radio-group v-model="softwareCopyright.method">
                <el-radio :label="1">单独开发</el-radio>
                <el-radio :label="2">合作开发</el-radio>
                <el-radio :label="3">委托开发</el-radio>
                <el-radio :label="4">下达任务开发</el-radio>
                <el-radio :label="5">其它</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-form>

        </div>
        <div style="margin-top: 60px">
          <span>
            <el-button type="primary" @click="submit(softwareCopyright)" :loading="loading">提交</el-button>
          </span>
          <span style="margin-left: 10px; margin-right: 10px">
            <el-upload
                action=""
                accept=".pdf"
                :auto-upload="false"
                :before-upload="beforeUpload"
                :on-change="uploadFile"
                style="display: inline-block;"
                v-if="uploadVisible === true"
            >
              <el-button type="danger">上传</el-button>
            </el-upload>
          </span>
          <span>
            <el-button type="success" @click="downloadFile" v-if="downloadVisible === true">下载</el-button>
          </span>
        </div>

      </el-main>
    </el-container>

  </div>
</template>
<script>
import {
  download,
  findSoftwareCopyrightDetail,
  getStudentInformation,
  submitSoftwareCopyright, upload
} from "@/api/student";

export default {
  data() {
    return {
      studentId: '',
      softwareCopyright: {
        softwareCopyrightId: 0,
        fullName: '',
        shortForm: '',
        version: '',
        owner: '',
        code: '',
        status: '',
        description: '',
        date: '',
        method: '',
        filePath: ''
      },
      rules: {
        fullName: {required: true, message: "请输入全称", trigger: "blur"},
        shortForm: {required: true, message: "请输入简称", trigger: "blur"},
        version: {required: true, message: "请输入版本号", trigger: "blur"},
        owner: {required: true, message: "请输入著作权人", trigger: "blur"},
        code: {required: true, message: "请输入著作权证书编号", trigger: "blur"},
        status: {required: true, message: "请输入著作权状态", trigger: "blur"},
        description: {required: true, message: "请描述一下您的软件", trigger: "blur"},
        date: {required: true, message: "请选择开发完成日期", trigger: "blur"},
        method: {required: true, message: "请选择开发方式", trigger: "blur"},
      },
      uploadVisible: false,
      downloadVisible: false,
      loading: false,
    };
  },
  mounted() {
    this.softwareCopyright.softwareCopyrightId = Number(window.location.search.substring(4));
    getStudentInformation().then((res1) => {
      this.studentId = res1.data.studentId;
      if (this.softwareCopyright.softwareCopyrightId !== 0) {
        findSoftwareCopyrightDetail(this.softwareCopyright.softwareCopyrightId).then(res2 => {
          this.softwareCopyright = res2.data
          this.uploadVisible = true
          if (this.softwareCopyright.filePath !== "null" && this.softwareCopyright.filePath !== null && this.softwareCopyright.filePath !== "") {
            this.downloadVisible = true
          }
        })
      }
    });
  },
  methods: {
    submit(softwareCopyright) {
      // console.log(softwareCopyright)
      this.$refs.form.validate(valid => {
        if (valid) {
          this.loading = true;
          submitSoftwareCopyright(softwareCopyright).then(res => {
            // console.log(res)
            // console.log(res.message)
            if (res.code !== 200) {
              this.$message.error(res.msg)
            } else {
              /*                getResearch().then((res0) => {
                                this.domains = res0.data;
                                // console.log(this.domains);
                              });*/
              this.$message.success(res.msg)
              this.$router.push("/student/software-copyright");
            }
            this.loading = false
          })
        } else {
          this.$message.error("请按照正确格式填写表单")
          this.loading = false;
        }
      })
    },
    beforeUpload(file) {
      // console.log(file);
    },
    uploadFile(file) {
      const uploadRequest = new FormData();
      uploadRequest.append('file', file.raw);
      uploadRequest.append('type', 4);
      uploadRequest.append('id', this.softwareCopyright.softwareCopyrightId);
      // console.log(uploadRequest)
      // 发起上传请求
      upload(uploadRequest).then(response => {
        if (response.code === 200) {
          this.$message.success(response.msg)
          this.$router.push("/student/software-copyright");
        } else {
          this.$message.error(response.msg)
        }
      }).catch(error => {
        // console.log(error)
        this.$message.error('文件上传失败')
      });
    },
    downloadFile() {
      const downloadRequest = new FormData();
      downloadRequest.append('type', 4);
      downloadRequest.append('id', this.softwareCopyright.softwareCopyrightId);
      download(downloadRequest).then(response => {
        // 创建 a 标签进行下载
        const url = window.URL.createObjectURL(new Blob([response]))
        const link = document.createElement('a')
        link.href = url
        link.setAttribute('download', this.softwareCopyright.filePath)
        document.body.appendChild(link)
        setTimeout(() => {
          link.click();
          document.body.removeChild(link); // 清理创建的a标签
        }, 0);
      })
    }
  }
}
</script>

